import React,{ useState,} from "react";
import { Steps,NavBar } from "antd-mobile";
import { useLocation,useNavigate } from "react-router-dom";
import Item from "antd-mobile/es/components/dropdown/item";
import dayjs from "dayjs";
import { LeftOutline } from 'antd-mobile-icons'
function Record() {
  const { Step } = Steps;
  const location = useLocation();
  const navigate = useNavigate();
  console.log(location.state)
  return (
    <div>
      <div className="inp">
      <LeftOutline onClick={() =>{
        navigate('/wxq/ord')
      }} className="inp1" color='#E3E8EA'
      style={{ fontSize: 25 }} />
        <h2>预约纪录</h2>
      </div>
      <div className="ordBox">
        <Steps direction="vertical">
          <Step
            
            description={
              <div className="ordBoxs">
                <div className="ordBoxs1s">
                <p className="ordBoxs1">{"预约人："+location.state.customer}</p>
                <p>{dayjs(location.state.time).format("YYYY-MM-DD HH:mm:ss")}</p>
                </div>
                <p className="ordBoxs2">放样任务</p>
                <p>客户的要求比较苛刻，测量的时候一定要细心，建议测量
                  之前，做好相关的准备工作</p>
              </div>
            }
            status="process"
          />
          <Step

            description={
              <div className="ordBoxs">
                <div className="ordBoxs1s">
                <p className="ordBoxs1">{"预约人："+location.state.customer}</p>
                <p>{dayjs(location.state.time).format("YYYY-MM-DD HH:mm:ss")}</p>
                </div>
                <p className="ordBoxs2">复测任务</p>
                <p>客户的要求比较苛刻，测量的时候一定要细心，建议测量
                  之前，做好相关的准备工作</p>
              </div>
            }
            status="wait"
          />
          <Step

            description={
              <div className="ordBoxs">
              <div className="ordBoxs1s">
              <p className="ordBoxs1">{"预约人："+location.state.customer}</p>
              <p>{dayjs(location.state.time).format("YYYY-MM-DD HH:mm:ss")}</p>
              </div>
              <p className="ordBoxs2">初测任务</p>
              <p>客户的要求比较苛刻，测量的时候一定要细心，建议测量
                之前，做好相关的准备工作</p>
            </div>
            }
            status="wait"
          />
          <Step

            description={
              <div className="ordBoxs">
              <div className="ordBoxs1s">
              <p className="ordBoxs1">{"预约人："+location.state.customer}</p>
              <p>{dayjs(location.state.time).format("YYYY-MM-DD HH:mm:ss")}</p>
              </div>
              <p className="ordBoxs2">任务描述</p>
              <p>客户的要求比较苛刻，测量的时候一定要细心，建议测量
                之前，做好相关的准备工作</p>
            </div>
            }
            status="wait"
          />
        </Steps>
      </div>
    </div>
  );
}

export default Record;
